<template>
	<view class="item">
		<view class="user-box">
			<view class="box-con">
				<view class="box-radio" v-if="isShowRadio">
					<radio @click="clickRadio" :checked="userData.isChecked" style="transform:scale(0.8)"
						color="#43CF7C"></radio>
				</view>
				<view class="user-head">
					<image :src="userData.head"></image>
				</view>
				<view class="user-nickname">
					<text>{{userData.nickname}}</text>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		props: {
			isShowRadio: {
				type: Boolean,
				default: false
			},
			userData: {
				type: Object,
				default: {}
			}
		},
		methods: {
			clickRadio() {
				this.$emit('clickRadio', this.userData)
			}
		}
	}
</script>

<style lang="scss" scoped>
	.user-box {
		width: 100%;
		height: 100rpx;

		.box-con {
			width: 94%;
			margin-left: 3%;
			display: flex;

			.box-radio {
				line-height: 100rpx;
			}

			.user-head {
				image {
					margin-top: 10rpx;
					width: 80rpx;
					height: 80rpx;
					border-radius: 50%;
				}
			}

			.user-nickname {
				line-height: 100rpx;
				font-size: 32rpx;
				margin-left: 30rpx;
			}
		}
	}
</style>
